<template>
	<view>
		<view class="container">
		  <view class="header">症状记录</view>
		  <view class="table-header">
		    <view class="table-header-cell">时间</view>

		    <view class="table-header-cell">症状</view>
		    <view class="table-header-cell">体温</view>
		    <view class="table-header-cell">备注</view>
		  </view>
		  <view class="table-row"  v-for="(item,idx) in records" :key="idx">
		    <view class="table-cell">{{item.day}}</view>
	
		    <view class="table-cell">{{item.symptom}}</view>
		    <view class="table-cell">{{item.temp}}℃</view>
		    <view class="table-cell">{{item.plusNote}}</view>
		  </view>
		</view>
	
	</view>
</template>

<script>
	import dayjs from 'dayjs'
	export default {
		data() {
			return {
				records:[],
				info:null
			}
		},
		mounted(){
			let that = this ;
			uni.getStorage({
				key: 'info',
				success: (res) => {
					this.info = JSON.parse(res.data)
					let user_id = this.info.user_id
					uni.request({
						url:'http://localhost:8085/api/health/getall',
						data:{"user_id":user_id},
						header: {
							'content-type': 'application/x-www-form-urlencoded'
						},
						method:'GET',
						success:function(res){
							that.records = res.data.data 
							that.records.map(item=>{
								item.day = dayjs(item.day).format('YYYY-MM-DD')
							})
						}
					})
				}
			})
			
		},
		methods: {
			
		}
	}
</script>

<style>
.container {
  padding: 20rpx;
  background-color: #F5F5F5;
}

.header {
  font-size: 28rpx;
  font-weight: bold;
  margin-bottom: 20rpx;
}

.table-header {
  display: flex;
  justify-content: space-between;
  background-color: #E0E0E0;
  padding: 10rpx;
}

.table-header-cell {
  flex: 1;
  font-size: 24rpx;
  font-weight: bold;
}

.table-row {
  display: flex;
  justify-content: space-between;
  background-color: #FFFFFF;
  padding: 10rpx;
  margin-top: 10rpx;
}

.table-cell {
  flex: 1;
  font-size: 24rpx;
  color: #333333;
}

</style>
